<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>creativepsd</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/responsive.css">
    <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">     
    <!-- шрифт с иконками -->

</head>
<body>
    <header>
        <!-- div не нужен, class нужно перенести в ссылку -->
        <a class="logo" href="#">
            <span>Creative</span><img src="img/goto.png" alt="">
        </a>            
        <div class="container">
            <div class="row">
                <div class="menu col-lg-10">
                    <ul class="main">
                        <li class="item"><a href="#">Home</a></li> <!-- лишение пробелы -->
                        <li class="item"><a href="#">Features</a></li>
                        <li class="item"><a href="#">Portfolio</a></li>
                        <li class="item"><a href="#">News</a></li>
                        <li class="item"><a href="#">Contact</a></li>
                    </ul>
                </div>                
            </div>
        </div>
        <div class="search">
            <img src="img/left_border_search.png">
            <input type="text" name="search" placeholder="Search"> <!-- size определить через сти -->
        </div>
    </header>	
    <section id="content">


    <div class="clearfix">
    <!-- slider -->
        <div class="slider">
            <div class="promo">
                <div class="image"></div>
                <div class="banner">
                    <h1>Responsive Design</h1>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent et ipsum tellus, vitae sagittis enim. Morbi ultricies ultrices elit vitae gravida. Pellentesque in risus neque, et vulputate massa. Phasellus nec velit sed diam euismod consequat. Maecenas posuere volutpat purus, vel vulputate ipsum commodo eget.</p>
                <a href="#">Read more</a>
                </div>
            </div>        
            <div class="scroll">
                <ul>
                    <li>1</li>
                    <li>2</li>
                    <li>3</li>
                </ul>
            </div>
        </div>  
        <!-- end slider  -->    
    </div>        
        
        <div class="container">
            <div class="row">
                <div class="item col-lg-3">
                    <div class="box clearfix">
                        <i class="fa fa-arrows-h"></i>
                        <h2>Responsive Layout</h2>
                    </div>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent et ipsum tellus, vitae sagittis enim. Morbi ultricies ultrices elit vitae gravida. Pellentesque in risus neque, et vulputate massa. Phasellus nec velit sed diam euismod consequat. Maecenas posuere volutpat purus, vel vulputate ipsum commodo eget.</p>
                </div>
                <div class="item col-lg-3">
                    <div class="box clearfix">
                        <i class="fa fa-bars"></i>
                        <h2>HTML5 / CSS3</h2>
                    </div>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent et ipsum tellus, vitae sagittis enim. Morbi ultricies ultrices elit vitae gravida. Pellentesque in risus neque, et vulputate massa. Phasellus nec velit sed diam euismod consequat. Maecenas posuere volutpat purus, vel vulputate ipsum commodo eget.</p>
                </div>
                <div class="item col-lg-3">
                    <div class="box clearfix">
                        <i class="fa fa-yelp"></i>
                        <h2>Modern &amp; Clean</h2>
                    </div>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent et ipsum tellus, vitae sagittis enim. Morbi ultricies ultrices elit vitae gravida. Pellentesque in risus neque, et vulputate massa. Phasellus nec velit sed diam euismod consequat. Maecenas posuere volutpat purus, vel vulputate ipsum commodo eget.</p>
                </div>
                <div class="item col-lg-3">
                    <div class="box clearfix">
                        <i class="fa fa-print"></i>
                        <h2>Eassily Customisable</h2>
                    </div>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent et ipsum tellus, vitae sagittis enim. Morbi ultricies ultrices elit vitae gravida. Pellentesque in risus neque, et vulputate massa. Phasellus nec velit sed diam euismod consequat. Maecenas posuere volutpat purus, vel vulputate ipsum commodo eget.</p>
                </div>
            </div>
        </div>
    </section>    
    
    <footer>
        <div class="container">
            <div class="row">
                <div class="col-lg-9">
                    <div class="sub-menu">
                        <ul>
                            <li><a href="#">Home</a></li>
                            <li><a href="#">Features</a></li>
                            <li><a href="#">Portfolio</a></li>
                            <li><a href="#">News</a></li>
                            <li><a href="#">Contact</a></li>
                        </ul>
                    </div>
                    <div class="contact">
                        <p>
                            <i class="fa fa-home"></i>
                            314 Columbus Ave. , San Francisco , CA 94133
                        </p>
                        <p>
                            <i class="fa fa-phone"></i>
                            <a href="#">(123) 456-78910</a>                            
                        </p>
                        <p>
                            <i class="fa fa-paper-plane"></i>
                            <a href="mailto:office@creative.com">office@creative.com</a>
                        </p>
                    </div>
                </div>
                <div class="subscribe col-lg-3">
                    <h4>Newsletter</h4>
                    <input class="asd" type="text" placeholder="E-mail address">
                    <a href="#"><i class="fa fa-chevron-right"></i></a>
                </div>
            </div>
        </div>
        <div class="copyright">
            <div class="container">
                <div class="row">
                    <div class="col-lg-10">
                        <p>2012 &copy; Creative Inc. All rights reserved.</p>                        
                    </div>
                    <div class="social col-lg-2">
                        <h4>Follow us:</h4>
                        <a href="#"><i class="fa fa-facebook"></i></a>
                        <a href="#"><i class="fa fa-twitter"></i></a>
                        <a href="#"><i class="fa fa-rss"></i></a>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    
    
    
    <script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')
    </script>
</body>
</html>